<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>修改个人信息</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>

    <style type="text/css">
        header {
            height: 65px;
            background: rgba(247, 235, 175, 1);
        }

        header span {
            line-height: 65px;
            font-size: 22px;
            font-weight: bolder;
            float: left;
            margin-left: 50px;
        }

        header #login {
            display: inline-block;
            float: right;
            margin-right: 150px;
            margin-top: 15px;
        }
        body {
            height: 670px;
            background: url(image/26.jpg) no-repeat;
            background-size: 100% 100%;
            text-align: center;
        }
        input,select, textarea,.input-group{
            height: 25px;
            border: 0;
            border-radius: 3px;
            margin-bottom: 15px;
        }
        .viewpersoninformation{
            margin-left: 400px;
            margin-top: 50px;
            width: 600px;
            height: 350px;
        }
        .data-common{
            display: inline-block;
            width: 400px;
            margin-top: 20px;
        }
        .common-span{
            display: inline-block;
            width: 100px;
            text-align: right;
        }
        .common-input {
            width: 200px;
            display: inline-block;
        }
        .sideBar {
            width: 200px;
            height: 550px;
            /* display: inline-block; */
            float: left;
            background: rgba(255, 255, 208, 0.8);
            border-right: 1px solid rgba(255, 255, 208, 1);
        }
    </style>
</head>
<body>

<header>
    <span align="left">分享式民宿酒店预订系统———修改个人信息</span>

</header>
<div class="sideBar">
    <div class="row" style="width: 215px;">
        <div class="span2">
            <ul class="nav nav-pills nav-stacked">
                <li><a href="publish.html">发布房源</a></li>
                <li><a href="publishhistory.html">我的房源</a></li>
                <li class="active">
                    <a href="viewpersoninformation.html">个人中心</a></li>
                <li><a href="index.html" id="over">注销登录</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="viewpersoninformation">
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label">用户名</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="username" placeholder="填写新用户名"></div>
    </div>
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label">性别</label>
        <div class="col-sm-10">
            <input type="radio" name="sexy" value="男">男&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" name="sexy" value="女">女
        </div>
    </div>
    <div class="form-group">
        <label for="idNumber" class="col-sm-2 control-label">身份证号</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="idNumber" placeholder="readonlyidNumber" readonly="readonly">
        </div>
    </div>
    <div class="form-group">
        <label for="city" class="col-sm-2 control-label">城市</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="city" placeholder="修改城市" >
        </div>
    </div>

    <div class="form-group">
        <label for="phoneNumber" class="col-sm-2 control-label">手机</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="phoneNumber" placeholder="修改手机号"></div>
    </div>
    <div class="form-group">
        <label for="Password" class="col-sm-2 control-label">密码</label>
        <div class="col-sm-10">
            <input type="password" class="form-control" id="password" placeholder="填写新密码"></div>
    </div>
    <div class="form-group">
        <label for="repassword" class="col-sm-2 control-label">确认密码</label>
        <div class="col-sm-10">
            <input type="password" class="form-control" id="repassword" placeholder="确认密码"></div>
    </div>
    <div class="form-group">
        <label for="idNumber" class="col-sm-2 control-label">个人描述</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="describe" placeholder="修改兴趣、爱好等信息" ></div>
    </div>


</div>
<div>
    <button class="btn btn-info" data-toggle="modal" type="button" id="confirmModifyButton">确认</button>
    <button class="btn btn-success" data-toggle="modal" type="button" id="back">返回</button>
</div>
<script src="js/jquery.min.js"></script>
<!-- 加载 Bootstrap 的所有JS插件。也可以根据需要只加载单个插件。 -->
<script src="js/bootstrap.min.js"></script>
</body>
<script type="text/javascript">
    $(document).ready(function () {
        var userId = localStorage.getItem('userId')//获取用户Id
        // console.log(userId)
        if (!userId) {
            window.location.href = 'index.html'
            //无用户id（级无登陆直接近页面不可以，直接去登录）
        }
        var args = {
            userKeyId: userId
        };
        $.get("/user/findOne",args,function (root) {
            $("#username").val(root.data.userName);

            $("input:radio[value='"+ root.data.sex +"']").attr("checked","checked");

            $("#idNumber").val(root.data.idCard);

            $("#city").val(root.data.city);

            $("#place").val(root.data.address);

            $("#phoneNumber").val(root.data.phoneNumber);

            $("#describe").val(root.data.introduce);

        });


        $("#confirmModifyButton").click(function () {
            if($("#repassword").val() != $("#password").val())
            {
                alert("两次输入的密码不一致！");
                return;
            }
            var args = {
                userKeyId:userId,
                name:$("#username").val(),
                sex:$("input:radio[name='sexy']").val(),
                idCard:$("#idNumber").val(),
                password:$("#repassword").val(),
                city:$("#city").val(),
                address:$("#place").val(),
                phoneNumber:$("#phoneNumber").val(),
                introduce:$("#describe").val()
            };

 

             $.get("/user/update",args,function(root){
                 if(root.code == 1)
                 {
                     alert("修改成功!");
                     window.location.href = 'viewpersoninformation.html';
                 }
                 else
                {
                     alert("修改失败");
                }
             });
             $("#back").click(function(){
                 window.location.href = 'viewpersoninformation.html'; 
             })

        });


        //数据回显
        var args = {
            userKeyId:userId
        };

        $.get("/user/findOne",args,function (root) {
            $("#username").val(root.data.userName);

            $("#sexy").val(root.data.sex);

            $("#idNumber").val(root.data.idCard);

            $("#city").val(root.data.city);

            $("#place").val(root.data.address);

            $("#phoneNumber").val(root.data.phoneNumber);

            $("#describe").val(root.data.introduce);

        });


        // js事件
        $("#back").click(function(){
            window.location.href = 'viewpersoninformation.html';

        });
        // $(this).hide();
        // });
        // 注销事件
        $("#over").click(function () {
            localStorage.setItem('userId', '');
        });
    });
</script>
</html>
